<!--
 * @Description: 
 * @Author: your name
 * @version: 
 * @Date: 2024-05-08 16:34:13
 * @LastEditors: your name
 * @LastEditTime: 2024-09-10 09:25:51
-->
<template>
    <div id="cesium-viewer">
        <slot />
        <tool-bar />
    </div>
</template>

<script setup>
import * as Cesium from "cesium";
import { onMounted, markRaw } from "vue";
import app from "../main";
import {
    initViewer,
    setScene,
    loadTilesets,
    handleDefaultModelEffect,
    flyToDefaultView,
} from "@/cesiumTools/sceneManager";
import { useLineData } from "@/store";
import { getWeather, getLine } from "@/api/line.js";
import toolBar from "@/tools/toolBar.vue";

const lineDataStore = useLineData();

//初始化cesium实例
Cesium.Ion.defaultAccessToken =
    "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiI3ODAzN2EzOS1kZDMzLTQ5Y2UtYjYxMi1jMzQxNTdiMTUzN2IiLCJpZCI6NDU5NDIsImlhdCI6MTYxNTYyNDQyOX0.BucgmI6OJ-7ixj7rcQ_Qyg45DkvdHmaLrFwyMYitLcI";

onMounted(async () => {
    const viewer = initViewer("cesium-viewer");
    // const data=await getWeather()
    // console.log(data);

    setScene(viewer);
    flyToDefaultView(viewer);
    const modelUrls = [
        {
            url: import.meta.env.VITE_BUILD_MODE + "/tileset.json",
            options: {},
        },
    ];
    lineDataStore.setViewer(markRaw(viewer));
    //获取地铁线数据
    getLine({}).then(data=>{
    //   console.log(lineDataStore);
      lineDataStore.setData(markRaw(data));
    })


    // // 加载多个3dtiles
    await loadTilesets(viewer,modelUrls,(tilesets)=>{
      handleDefaultModelEffect(tilesets[0])  // 处理默认模型特效
      lineDataStore.setTileset(markRaw(tilesets[0]))  // 设置默认模型
    })
});
</script>
<style>
#cesium-viewer {
    width: 100%;
    height: 100%;
    pointer-events: all;
}
</style>
